<template>
    <div class="tabpage">
        <van-tabs color="#EE87B6">
            <van-tab title="精选"><Tab1 :proarr="arr1"></Tab1></van-tab>
            <van-tab title="母婴"><Tab1 :proarr="arr2"></Tab1></van-tab>
            <van-tab title="网红"><Tab1 :proarr="arr3"></Tab1></van-tab>
            <van-tab title="名师"><Tab1 :proarr="arr4"></Tab1></van-tab>
        </van-tabs>
    </div>
</template>
<script>

import Tab1 from './AllTabPage/tab1.vue'
export default {
    components:{
        Tab1
    },
     data() {
        return {
             type:3,
             pageSize:26,
             arr:[]
        }
    },
    created(){
       this. axios.get('/recommend/getRandContent?_t=1582179443400&csrfToken=eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJhdWQiOjAsImV4cCI6MTc3MTU2NjMxNCwiaWF0IjoxNTgyMTc3NTE0fQ.iBmGtQ0fasTTaSuApywmN6Ms0aNYwUvkGLoXX6V6hO8', {
            params: {
               type:this.type,
               pageSize:this.pageSize
            },
            }).then(res => {
                this.arr=res.data.data.data;
                window.console.log(this.arr);

            });
    },
    computed: {
        arr1(){
          return this.arr.slice(0,8)   
        },
        arr2(){
            return this.arr.slice(8,14)   
        },
        arr3(){
            return this.arr.slice(14,20)   
        },
        arr4(){
            return this.arr.slice(20,26)   
        }
    }
}
</script>
<style scoped>
.tabpage{margin-top: .2rem}
</style>